<template>
	<div>
		<!--<div class="template" v-show="loading">
			<div><mt-spinner :type="3" :size="60"></mt-spinner></div>
		</div>-->
		<header class="navigation">
			<div @click="retreat"><img src="../assets/rightbut.png"></div>
			<div>提现明细</div>
			<div></div>
		</header>
		<div class="money">
			<div>累计提现成功(元)</div>
			<div>{{detail.totalMoney}}</div>
		</div>
		<ul v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" infinite-scroll-distance="10" class="contentList">
			<li v-for="item in list">
				<div class="detail">
					<div>+{{item.money}}</div>
					<div>
						<div v-if='item.state == 0'>申请中</div>
						<div v-if='item.state == 1'>审核通过</div>
						<div v-if='item.state == 2'>提现成果</div>
						<div v-if='item.state == 3'>提现失败</div>
						<div>{{item.createTime}}</div>
					</div>
				</div>
			</li>
		</ul>
	</div>
</template>

<script>
	import { BaseUrl } from '../Baseurl/common.js';
	export default{
		data(){
			return{
				token:'',
				detail:[],
				list:[],
				loading:false,
				index: 0,
			}
		},
		created(){
			this.token = localStorage.getItem('token');
			//累计提现
			this.singInfo(this.index);
		},
		methods:{
			//导航退后
			retreat:function(){
				window.history.go(-1);
			},
			singInfo(index){
				var url = BaseUrl + 'withDrawals/withDrawals/list?appId=wap' + '&token=' + this.token + '&length=10' + '&start= ' + this.index;
				this.$http.get(url).then(res=>{
					console.log(res.data.data)
					if(res.data.code == '10000'){
//						this.loadings = false;
						this.detail = res.data.data;
						this.list = this.list.concat(res.data.data.list);
						if(res.data.data.isMore == "none") {
							this.loading = true;
						return;
						} else if(res.data.data.isMore == "have") {
							this.loading = false;
							this.index++;
						}
					}
				})
			},
			loadMore() {
				this.loading = this.loading;
				if(this.loading == false){
					setTimeout(() => {
						this.singInfo(this.index);
						this.loading = this.loading;
					}, 2500);
				}
			}
		}
	}
</script>

<style scoped="scoped">
	.template{
		width: 100%;
		height: 100%;
		/*background: rgba(0,0,0,0.5);*/
		position: absolute;
		z-index: 99;
	}
	.template div{
		position: absolute;
		top: 5.5rem;
		left: 50%;
		margin-left: -0.6rem;
	}
	.navigation{
		height: 1rem;
		background: #fff;
		display: flex;
		border-bottom: 1px solid #dcd2d1;
		justify-content: space-between;
		align-items: center;
		padding: 0 0.24rem;
	}
	
	.navigation img{
		width: 0.2rem;
		height: 0.36rem;
		display: block;
	}
	.money{
		padding: 0 0.25rem 0.2rem 0.25rem;
		border-bottom: 0.1rem solid #f2f2f2;
	}
	.money div:first-child{
		color: #323232;
		font-size: 0.2rem;
		padding: 0.1rem 0;
	}
	.money div:last-child{
		color: #ff2040;
		font-size: 0.5rem;
	}
	.contentList{
		height: 10.5rem;
		overflow-y: auto;
	}
	.detail{
		padding: 0.1rem 0.25rem;
		border-bottom: 1px solid #CCCCCC;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 0.26rem;
	}
	.detail div:first-child{
		color: #323232;
	}
	.detail div:last-child{
		text-align: right;
	}
	.detail div:last-child div:first-child{
		color: #323232;
		margin-bottom:0.2rem ;
	}
	.detail div:last-child div:last-child{
		color: #CCCCCC;
	}
</style>